﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="RoleConfig_Entity.aspx.cs" Inherits="Easy.Web.Pages.PrivilegePages.RoleConfig_Entity" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <link href="/_css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="/_css/common.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="/_css/iconfont.css" />
    <script src="/_js/jquery-1.9.1.min.js" type="text/javascript"></script>
    <script src="/_js/bootstrap.min.js" type="text/javascript"></script>
    <script src="/_js/json2.js" type="text/javascript"></script>
    <script src="/_js/custom.js" type="text/javascript"></script>
    <style>
        .row{margin-right:0px;}
        .panel{border:none;}
        .page-header{margin:15px;}
        .page-header+.btn-primary{margin:0px 15px 10px 5px;}
        .panel-heading{padding:3px 15px;height:40px;line-height:34px;}
        .table{padding:0;margin:0;border:none;}      
        .table thead th,.table tbody td{width:168px;}      
        .table th.table-btn,.table tbody td.table-btn{width:100px;}
        .table th:first-child,.table tbody td:first-child{width:30px;}
        #entityList_div, #table-title{min-width:1149px;}
        .table-responsive{border:1px solid #e1e6eb;border-top:none;}     
        #table-title{position:relative;}
        #table-title thead tr th{border-bottom:none;}
        @media screen and (max-width: 767px){
            .table-responsive {
                margin-bottom:0px;
                border:none;
                overflow:auto;
                border:1px solid #e1e6eb;
                border-top:none;
            }
        }
        .table tbody span {
            cursor:pointer;
        }
        #table-title thead th span {
            cursor:pointer;
        }
        .roleIco::selection,span::selection{
            background:none;
        }
        .table thead span,.table tbody span {
            display:block;
            height:100%;         
        }
    </style>

    <script>
        window.onload = function () {
            var roleId = $("#RoleId").val();
            GetEnitityListForRole();
            //横向绑定，填充表头背景
            $("#table-title").parent().css({ "background": "#F5F6FA", "border-top": "1px solid #e1e6eb", "border-bottom": "1px solid #e1e6eb" });
            $("div.table-responsive").scroll(function () {
                var left = (-1) * $(this).scrollLeft();
                $("#table-title").css("left", left);
            });
            $('.roleIco').parent().css('cursor','pointer');
            $('.roleIco').parent().click(function () {
                var child = $(this).children();
                if ($(child).attr("p") == "0") {
                    $(child).attr("src", role_ico["1"]);
                    $(child).attr("p", "1");
                }
                else if ($(child).attr("p") == "1") {
                    $(child).attr("src", role_ico["2"]);
                    $(child).attr("p", "2");
                }
                else if ($(child).attr("p") == "2") {
                    $(child).attr("src", role_ico["4"]);
                    $(child).attr("p", "4");
                }
                else if ($(child).attr("p") == "4") {
                    $(child).attr("src", role_ico["8"]);
                    $(child).attr("p", "8");
                }
                else if ($(child).attr("p") == "8") {
                    $(child).attr("src", role_ico["0"]);
                    $(child).attr("p", "0");
                }
            });
            
            //原先 点击 图标触发事件
            /*
            $('.roleIco').parent().css('border','1px solid red');
            $('.roleIco').on('click', function () {

                if ($(this).attr("p") == "0") {
                    $(this).attr("src", role_ico["1"]);
                    $(this).attr("p", "1");
                }
                else if ($(this).attr("p") == "1") {
                    $(this).attr("src", role_ico["2"]);
                    $(this).attr("p", "2");
                }
                else if ($(this).attr("p") == "2") {
                    $(this).attr("src", role_ico["4"]);
                    $(this).attr("p", "4");
                }
                else if ($(this).attr("p") == "4") {
                    $(this).attr("src", role_ico["8"]);
                    $(this).attr("p", "8");
                }
                else if ($(this).attr("p") == "8") {
                    $(this).attr("src", role_ico["0"]);
                    $(this).attr("p", "0");
                } 
            });*/
        }

        function GetEnitityListForRole() {
            $.ajax({
                url: "/Service/Privilege/GetEntityRoleList.ashx",
                async: false,
                type: "post",
                dataType: "JSON",
                data: {
                    "RoleId": $("#RoleId").val()
                },
                success: function (data, textStatus) {
                    var SMShtml1 = "<table class='table table-hover'>"
                        + " <thead><tr><th>#</th><th>实体</th><th>实体中文名</th><th><span>创建"
                                           + "  </span></th><th><span>读</span></th><th><span>写</span></th>"
                                            + "<th><span>删除</span></th><th><span>分派</span></th>"
                                           + "</tr></thead><table>";
                    $("#table-title").html(SMShtml1);

                    var SMShtml2 = "<div id='scroll-table'><table class='table table-hover'><tbody>";
                    for (var i = 0; i < data.length; i++) {
                        var item = data[i];
                        SMShtml2 += "<tr entityId='" + item.EntityId + "'  name='list' id=\"" + (i + 1) + "\">"
                        /*NO*/ + "<td>" + (i + 1) + "</td>"
                    + "<td  id=\"list" + (i + 1) + "\"><span>" + item.EntityName + "</span></td>"
                    + "<td  id=\"list" + (i + 1) + "\"><span>" + item.EntityDisplayName + "</span></td>"//获取实体中文名
                      + "<td   id=\"list" + (i + 1) + "\"><img class='roleIco' src='" + role_ico[item.Create] + "' Read='Read' p='" + item.Create + "' ></td>"
                     + "<td   id=\"list" + (i + 1) + "\"><img class='roleIco' src='" + role_ico[item.Read] + "' Read='Read' p='" + item.Read + "' ></td>"
                   + "<td   id=\"list" + (i + 1) + "\"><img class='roleIco'  src='" + role_ico[item.Write] + "' Write='Write' p='" + item.Write + "' ></td>"
                        + "<td   id=\"list" + (i + 1) + "\"><img  class='roleIco' src='" + role_ico[item.Delete] + "' Delete='Delete' p='" + item.Delete + "' ></td>"
                         + "<td   id=\"list" + (i + 1) + "\"><img  class='roleIco' src='" + role_ico[item.Assign] + "' Assign='Assign' p='" + item.Assign + "' ></td>"
                            + "</tr>";
                    }
                    SMShtml2 += "</tbody></table></div>";
                    $("#entityList_div").html(SMShtml2);

                    //滚动table的高度
                    var height = window.innerHeight - 183;
                    $("#scroll-table").height(height);

                    //横向绑定
                    $(".table tbody span").on('click', function () {
                        var row_ico = $(this).parent().siblings().find(".roleIco");
                        var row_arr = [];
                        for (var i = 0; i < row_ico.length; i++) {
                            var row_p = row_ico[i];
                            row_arr.push($(row_p).attr("p"));
                        }
                        var p_min = Math.min.apply(null, row_arr);//获取同一行中最小的p的值
                        for (j = 0; j < row_ico.length; j++) {
                            if ($(row_ico).eq(j).attr("p") == p_min) {
                                if (p_min == "0") {
                                    $(row_ico).eq(j).attr("src", role_ico["1"]);
                                    $(row_ico).eq(j).attr("p", "1");
                                }
                                else if (p_min == "1") {
                                    $(row_ico).eq(j).attr("src", role_ico["2"]);
                                    $(row_ico).eq(j).attr("p", "2");
                                }
                                else if (p_min == "2") {
                                    $(row_ico).eq(j).attr("src", role_ico["4"]);
                                    $(row_ico).eq(j).attr("p", "4");
                                }
                                else if (p_min == "4") {
                                    $(row_ico).eq(j).attr("src", role_ico["8"]);
                                    $(row_ico).eq(j).attr("p", "8");
                                }
                                else if (p_min == "8") {
                                    $(row_ico).eq(j).attr("src", role_ico["0"]);
                                    $(row_ico).eq(j).attr("p", "0");
                                }
                            }
                        }
                    });



                    //列绑定
                    $(".table thead span").on('click', function () {
                        var index = $(this).parent().index();
                        var tr_row = $(".table tbody tr");
                        var col_arr = [];
                        for (var i = 0; i < tr_row.length; i++) {
                            var col = tr_row[i];
                            var col_p = $(col).children("td").eq(index).find(".roleIco");
                            col_arr.push($(col_p).attr("p"));
                        }
                        var col_min = Math.min.apply(null, col_arr);//获取同一列中最小的p的值
                        for (var j = 0; j < tr_row.length; j++) {
                            var p = $(tr_row).eq(j).children("td").eq(index).find(".roleIco");
                            if ($(p).attr("p") == col_min) {
                                if (col_min == "0") {
                                    $(p).attr("src", role_ico["1"]);
                                    $(p).attr("p", "1");
                                }
                                else if (col_min == "1") {
                                    $(p).attr("src", role_ico["2"]);
                                    $(p).attr("p", "2");
                                }
                                else if (col_min == "2") {
                                    $(p).attr("src", role_ico["4"]);
                                    $(p).attr("p", "4");
                                }
                                else if (col_min == "4") {
                                    $(p).attr("src", role_ico["8"]);
                                    $(p).attr("p", "8");
                                }
                                else if (col_min == "8") {
                                    $(p).attr("src", role_ico["0"]);
                                    $(p).attr("p", "0");
                                }
                            }

                        }
                    });



                },
                error: function (data, textStatus) {
                    alert("ajax错误");

                }
            });

        }

        function btn_update() {
            var RolePrivilege = {};
            RolePrivilege["RoleId"] = $("#RoleId").val();
            RolePrivilege["EntityPrivileges"] = [];
            $("#entityList_div").find("tr[id]").each(function () {
                var item = {};
                item["EntityId"] = $(this).attr("entityId");
                item["EntityName"] = $(this).children().eq(1).find("span").html();

                item["EntityDisplayName"] = $(this).children().eq(2).find("span").html();
                item["Create"] = $(this).children().eq(3).children().attr("p");
                item["Read"] = $(this).children().eq(4).children().attr("p");
                item["Write"] = $(this).children().eq(5).children().attr("p");
                item["Delete"] = $(this).children().eq(6).children().attr("p");
                item["Assign"] = $(this).children().eq(7).children().attr("p");

                RolePrivilege["EntityPrivileges"].push(item);
            });
            
            $.ajax({
                url: "/Service/Privilege/UpdateRole.ashx",
                async: false,
                type: "post",
                dataType: "JSON",
                data: {
                    "RoleId": $("#RoleId").val(),
                    "ShowType":"1",
                    "RolePrivilege": JSON.stringify(RolePrivilege),
                    "SiteMap":""
                },//ShowType=1则表示修改实体权限 2为修改站点图信息
                success: function (data, textStatus) {


                    if (data.Result == "0") {
                        location.reload();
                    }
                    else {
                        alert(data.Remark);
                    }
                },
                error: function (data, textStatus) {

                    alert("错误");

                }

            });
            

        }
    </script>
</head>
<body>
    <form id="form1" runat="server">


        <div class="">
            <div class="row">
                <div class="col-lg-12">
                    <input id="RoleId" type="hidden" value="<%=role.RoleId %>" />
                    <input id="BusinessUnitId" type="hidden" value="<%=role.OwningBusinessUnit %>" />
                    <h1 class="page-header">实体权限
                        <button type='button' id='btn_updateRole' class='btn btn-primary ng-binding' style="float: right;"
                            onclick="btn_update();">
                            <span class="glyphicon glyphicon-floppy-save"></span>&nbsp;保存</button></h1>
                </div>
                <!-- /.col-lg-12 -->
            </div>
            <!-- /.row -->
            <div class="row">
                <div class="col-lg-12">
                    <div class="panel panel-default">
                        <!-- /.panel-heading -->
                        <div class="panel-body">
                            <div class="table-responsive" style="overflow: hidden; border-bottom: none;">
                                <div id="table-title">



                                </div>
                            </div>
                            <div class="table-responsive">
                                <div id="entityList_div">



                                </div>
                            </div>
                            <!-- /.table-responsive -->
                        </div>
                        <!-- /.panel-body -->
                    </div>
                    <!-- /.panel -->
                </div>
            </div>
        </div>

    </form>
</body>
</html>
